import React, { Component } from 'react';
import { observer } from 'mobx-react';
import { InputItem, List, Tools } from "weaver-mobile";
import { createForm } from 'rc-form';
import VerificationCode from "../password/forgetPassword/VerificationCode.js";
const getLabel = Tools.getLabel;

@observer
class VerifyForm extends Component {
    componentDidUpdate(prevProps, prevState) {
        const { form: { getFieldsValue }, store: { setFormParams } } = this.props;

        setFormParams(getFieldsValue(["pswd", "validatecode"]));
    }

    render() {
        const { form: { getFieldProps }, store: { date } } = this.props;

        return (
            <List>
	        	<InputItem
		            {...getFieldProps("pswd")}
		            clear
		            type="password"
		            placeholder={getLabel('504331',"请先输入登录密码")}
		       />
		       <InputItem
		            {...getFieldProps("validatecode")}
		            clear
		            placeholder={getLabel(511061, '请填写验证码！').replace("！", "")}
		            extra={<div className="verificationCode"><VerificationCode date={date} extra={{from: "_changePass"}}/></div>}
		       />
        	</List>
        );
    }
}

export default createForm()(VerifyForm);